
extends simplelayout
doctype html
block content

    html(lang='en-US')
        head
            meta(charset='utf-8')
            link(rel='icon', href='https://static.jianshukeji.com/highcharts/images/favicon.ico')
            meta(name="viewport" content="width=device-width, initial-scale=1")


    script(src='/javascripts/jquery-1.11.0.min.js')
    script(src='/javascripts/highcharts.js')
    script(src='/javascripts/highcharts-more.js')
    script(src='/javascripts/xrange.js')
    script(src='/javascripts/exporting.js')
    script(src='/javascripts/series-label.js')


    link(rel='shortcut icon', href='http://static.tmimgcdn.com/img/favicon.ico')
    link(rel='icon', href='http://static.tmimgcdn.com/img/favicon.ico')
    link(rel='stylesheet', type='text/css', media='all', href='/stylesheets/bootstrap.min.css')
    link(rel='stylesheet', type='text/css', media='all', href='/stylesheets/bootstrap-glyphicons.css')
    link(rel='stylesheet', type='text/css', media='all', href='/stylesheets/styles.css')


    div(style="width: 1000px; margin: 50px 200px;")
        ul(id="position")

    body
        div(id="timechart2" style='min-width: 300px;max-width: 1500px;margin: 1em auto;')



    script(type='text/javascript').
        function search_graph_med(Term2) {
            $.ajax({
                url: "/search/graph_med/list",
                type: "POST",
                data: {term: Term2},
                success: function (data) {
                    if (data == '') {
                        alert("No or lack of relevant data!" + "\n" + "Click to close the message box.");
                    } else {
                        var drugcategory = [];
                        var drugresult = [];
                        var obj = {};
                        var arrData = [];
                        var starttime = [];
                        var endtime = [];
                        var strength = [];
                        var dosevalue = [];
                        var doseunit = [];
                        var dosechange = [];

                        ////////DRUG DATA/////////
                        var drug = [data[0]];
                        var drugflag = 0;
                        for (var w = 0; w < data.length; w++) {
                            for (var o = 0; o < drug.length; o++) {
                                if (data[w].DRUG_NAME_EN == drug[o].DRUG_NAME_EN && data[w].STARTDATE == drug[o].STARTDATE && data[w].ENDDATE == drug[o].ENDDATE && data[w].PROD_STRENGTH == drug[o].PROD_STRENGTH && data[w].DOSE_VAL_RX == drug[o].DOSE_VAL_RX && data[w].DOSE_UNIT_RX == drug[o].DOSE_UNIT_RX) drugflag = 1;
                            }
                            if (drugflag == 0) drug.push(data[w]);
                            drugflag = 0;
                        }

                        var c = 0;
                        for (var q = 0; q < drug.length; q++) {
                            drugcategory[c] = [drug[q].DRUG_NAME_EN];
                            starttime[c] = [drug[q].STARTDATE];
                            if (drug[q].ENDDATE == null) endtime[c] = [drug[q].STARTDATE];
                            else endtime[c] = [drug[q].ENDDATE];
                            strength[c] = [drug[q].PROD_STRENGTH];
                            dosevalue[c] = [drug[q].DOSE_VAL_RX];
                            doseunit[c] = [drug[q].DOSE_UNIT_RX];
                            c++;
                        }
                        for (var i = 0; i < drug.length; i++) {

                            if (!obj[drugcategory[i]]) {
                                drugresult.push(drugcategory[i]);
                                obj[drugcategory[i]] = true;
                            }
                        }
                        drugresult.sort();
                        for (var t = 0; t < drugresult.length; t++) {
                            var samedrug = [];
                            var j = 0;
                            for (var u = 0; u < c; u++) {
                                if (drugcategory[u][0] == drugresult[t][0]) {
                                    samedrug[j] = u;
                                    j++;
                                }
                            }
                            var value = [];
                            for (var j0 = 0; j0 < j; j0++) {

                                //unification of units
                                value[j0] = parseFloat(dosevalue[samedrug[j0]][0]);
                                if (doseunit[samedrug[j0]][0] == "g") value[j0] = value[j0] * 1000000;
                                else if (doseunit[samedrug[j0]][0] == "mg" || doseunit[samedrug[j0]][0] == "mg/ml" || doseunit[samedrug[j0]][0] == "mg/kg" || doseunit[samedrug[j0]][0] == "mg/hr") value[j0] = value[j0] * 1000;
                                else if (doseunit[samedrug[j0]][0] == "mg/min" || doseunit[samedrug[j0]][0] == "mg/kg/hr") value[j0] = value[j0] * 1000 / 60;
                                else if (doseunit[samedrug[j0]][0] == "mg/day" || doseunit[samedrug[j0]][0] == "mg/24h") value[j0] = value[j0] * 1000 / 24;

                                if (j0 == 0) dosechange[samedrug[j0]] = "I";
                                else if (value[j0] > value[j0 - 1]) {
                                    dosechange[samedrug[j0]] = "↑";
                                } else if (value[j0] < value[j0 - 1]) {
                                    dosechange[samedrug[j0]] = "↓";
                                } else if (value[j0] == value[j0 - 1]) {
                                    dosechange[samedrug[j0]] = "-";
                                } else dosechange[samedrug[j0]] = "x";
                            }
                        }

                        for (var r = 0; r < c; r++) {
                            if (starttime[r][0] == endtime[r][0]) {  //time point
                                var stp = starttime[r][0]
                                var tp = new Date(stp)
                                var edt = new Date(tp.setHours(tp.getHours() + 1)).format("yyyy-MM-dd hh:mm:ss");
                                arrData[r] = {
                                    x: Date.UTC(chGMT(starttime[r][0]).slice(0, 4), chGMT(starttime[r][0]).slice(5, 7) - 1, chGMT(starttime[r][0]).slice(8, 10), chGMT(starttime[r][0]).slice(11, 13), chGMT(starttime[r][0]).slice(14, 16), chGMT(starttime[r][0]).slice(17, 19)),
                                    x2: Date.UTC(chGMT(edt).slice(0, 4), chGMT(edt).slice(5, 7) - 1, chGMT(edt).slice(8, 10), chGMT(edt).slice(11, 13), chGMT(edt).slice(14, 16), chGMT(edt).slice(17, 19)),
                                    y: in_array(drugcategory[r], drugresult),
                                    strength: strength[r][0],
                                    drug: drugcategory[r][0],
                                    dosevalue: dosevalue[r][0],
                                    doseunit: doseunit[r][0],
                                    dosechange: dosechange[r]
                                }
                            } else { //time period
                                arrData[r] = {
                                    x: Date.UTC(chGMT(starttime[r][0]).slice(0, 4), chGMT(starttime[r][0]).slice(5, 7) - 1, chGMT(starttime[r][0]).slice(8, 10), chGMT(starttime[r][0]).slice(11, 13), chGMT(starttime[r][0]).slice(14, 16), chGMT(starttime[r][0]).slice(17, 19)),
                                    x2: Date.UTC(chGMT(endtime[r][0]).slice(0, 4), chGMT(endtime[r][0]).slice(5, 7) - 1, chGMT(endtime[r][0]).slice(8, 10), chGMT(endtime[r][0]).slice(11, 13), chGMT(endtime[r][0]).slice(14, 16), chGMT(endtime[r][0]).slice(17, 19)),
                                    y: in_array(drugcategory[r], drugresult),
                                    strength: strength[r][0],
                                    drug: drugcategory[r][0],
                                    dosevalue: dosevalue[r][0],
                                    doseunit: doseunit[r][0],
                                    dosechange: dosechange[r]
                                }
                            }
                        }

                        $(function () {
                            function syncExtremes(e) {
                                var thisChart = this.chart;
                                if (e.trigger !== 'syncExtremes') {
                                    Highcharts.each(Highcharts.charts, function (chart) {
                                        if (chart !== thisChart) {
                                            if (chart.xAxis[0].setExtremes) {
                                                chart.xAxis[0].setExtremes(e.min, e.max, undefined, false, {trigger: 'syncExtremes'});
                                            }
                                        }
                                    });
                                }
                            }

                            Highcharts.chart('timechart2', {
                                chart: {
                                    type: 'xrange',
                                    marginLeft: 150,
                                    zoomType: 'xy',
                                    panning: true,
                                    panKey: 'ctrl'
                                },
                                title: {
                                    text: 'MEDICATION-ICUSTAYID: ' + Term2
                                },
                                subtitle: {
                                    text: 'Drag to select the zoom area; Press ctrl to pan the chart left or right; Click on the legend to hide or resume display.'
                                },
                                xAxis: {
                                    type: 'datetime',
                                    events: {
                                        setExtremes: syncExtremes
                                    },
                                    title: {
                                        text: 'Medication Time'
                                    }
                                },
                                yAxis: [{
                                    title: {
                                        text: ''
                                    },
                                    categories: drugresult,//y轴的值(药品名称需要查询)
                                    reversed: true,//y轴值上下顺序反向
                                    tickInterval: 1
                                }],
                                tooltip: {
                                    headerFormat: '{point.x:%A,%b.%e,%Y,%H:%M:%S}-{point.x2:%A,%b.%e,%Y,%H:%M:%S}<br>',
                                    pointFormat: '<b>Drug:</b>{point.drug}<br><b>Strength:</b>{point.strength}<br><b>Dosage:</b>{point.dosevalue}{point.doseunit} ',
                                    positioner: function () {//固定标签显示位置
                                        return {x: this.chart.chartWidth - this.label.width - 1, y: 0};
                                    },
                                    crosshairs: [{
                                        width: 1,
                                        color: "#006cee",
                                        dashStyle: 'longdashdot'

                                    }, {
                                        width: 1,
                                        color: "#006cee",
                                        dashStyle: 'longdashdot'
                                    }]

                                },
                                legend: {
                                    layout: 'vertical',
                                    align: 'right',
                                    verticalAlign: 'middle'
                                },
                                series: [{
                                    name: 'Drugs',
                                    dashStyle: 'solid',
                                    pointWidth: 5,
                                    data: arrData,
                                    dataLabels: {
                                        enabled: true,
                                        defer: false,
                                        inside: true,
                                        align: 'center',
                                        format: '{point.dosechange}'
                                    }
                                }]
                            });
                        });
                    }
                }
            })
        }





        Date.prototype.format = function (format) {
               var o = {
                   "M+": this.getMonth() +1, //month
                   "d+": this.getDate(), //day
                   "h+": this.getHours(), //hour
                   "m+": this.getMinutes(), //minute
                   "s+": this.getSeconds(), //second
                   "q+": Math.floor((this.getMonth() + 3) / 3), //quarter
                   "S": this.getMilliseconds() //millisecond
               }

           }

           function chGMT(gmtDate) {
               return gmtDate;
           }

           function in_array(searchString, array) {
               for (var i = 0; i < array.length; i++) {
                   if (searchString == array[i][0]) return i;
               }
           }


        window.onload = function () {
            search_graph_med();
        }



